<template>
    <div class="swiper">
        

        <van-swipe :autoplay="2000" class="outer">
            <van-swipe-item v-for="item in gallery" :key="item.id">
                <img :src="item.img_url" alt=""></van-swipe-item>
            
            <!-- <template #indicator>
                <div class="custom-indicator">
                    <p>天猫双12</p>
                    <p>{{info.retail_price|Price}}</p>
                </div>
            </template> -->
            </van-swipe>
    </div>
</template>

<script>
export default {
    name: 'VueSwiper',

    data() {
        return {
            
        };
    },
    props:['gallery','info'],

    mounted() {
        
    },

    methods: {
        
    },
};
</script>

<style lang="less" scoped>
.swiper{
    .outer{
        position: relative;
        height: 300px;
        img{
            width: 100%;
        }
    }
    .custom-indicator {
        width: 100%;
        position: absolute;
        // right: 5px;
        bottom: 5px;
        padding: 2px 5px;       
        font-size: 12px;
        background: red;
        height: 40px;
        opacity: 0.8;
        
        p{
            font-size: 20px;
        }
    }
}
</style>